<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body class="df fdc body">
    <!-- 顶部 -->
    <section class="topBox df fdc">
        <p class="outRun">户外跑</p>
        <div class="topTxt df jcsb">
            <p class="running">运动中</p>
            <div>
                <i class="iconfont icon-yinle1"></i>
                <i class="iconfont icon-tiaojiepeizhi"></i>
            </div>
        </div>
    </section>
    <!-- 公里 -->
    <section class="kilbox df aic jcc">
        <span class="kilNum">99.99</span>
        <span class="kilT">公里</span>
    </section>
    <!-- GPS -->
    <section class="GPS df jcsb aic">
        <div class="GPSText">GPS信号度低, 数据精准度低</div>
        <div class="line"></div>
        <i class="iconfont icon-dingwei1"></i>
    </section>
    <!-- 用时、消耗、配速 -->
    <section class="timeBox df jcsa">
        <div class="df fdc ">
            <div class="df fdc aic jcc">
                <i class="iconfont icon-sudu"></i>
                <p>配速</p>
            </div>
            <div class="comNum">--</div>
        </div>
        <div class="df fdc ">
            <div class="df fdc aic jcc">
                <i class="iconfont icon-qialuli"></i>
                <p>千卡</p>
            </div>
            <div class="comNum">00:00:20</div>
        </div>
        <div class="df fdc ">
            <div class="df fdc aic jcc">
                <i class="iconfont icon-sudu"></i>
                <p>配速</p>
            </div>
            <div class="comNum">3000</div>
        </div>

    </section>
    <!-- 暂停、锁 -->
    <section class="pause df aic jcsb">
        <div class="pauseBtn df fdc aic jcc">
            <i class="iconfont icon-stop"></i>
            <!-- <i class="iconfont icon-bofang"></i> -->
            <p>暂停</p>
        </div>
        <i class="iconfont icon-suoding lock"></i>
        <!-- 继续暂停 -->
        <div class="maskbtn df jcsb">
            <button class="b continue1 ">
                <i class="iconfont icon-bofang"></i>
                <p>继续训练</p>
            </button>
            <button class="b end">
                <i class="iconfont icon-jieshu"></i>
                <p>结束训练</p>
            </button>
        </div>
    </section>

</body>

</html>